<html>
<head>
  <meta charset="utf-8"/>
</head>

<div id="app">
  <input type="button" value="添加学生" v-on:click="addStudent()">
  <a href="http://www.baidu.com">点我一下，立刻知道</a>
</div>
</html>
<script src="js/vue.js"></script>
<script src="js/axios-0.18.0.js"></script>

<script>
new Vue({
  el: "#app",
  methods: {
    //新增学生
    addStudent() {
      alert("添加按钮被点击了...")
      //1. 发送异步请求, 进行添加
      axios({
        method: "post",
        url: "http://localhost:8080/student/add",
        data: "name=张三"
      }).then((resp) => {
        //2. 接收服务器响应结果
        if (resp.data == "success") {
          //c. 给出"添加成功"消息提示
          alert('恭喜你，添加成功!');
        } else {
          //添加失败,给出错误提示消息
          alert('添加失败');
        }
      })
    }
  },
  data() {
    return {}
  },
  /*钩子函数: 当页面加载完成后, 请求服务器获取所有品牌数据*/
  mounted() {}
})

</script>